<script setup >
import { onMounted, reactive,defineProps, ref,resolveComponent } from 'vue';
import {RecommendServer} from '@/api/imt'
import {useIMStore} from '@/stores/page_tb.js'
import {useRongziyulanPage} from '@/api/rongziyulan'
import {useRongziStore} from '@/stores/rongzi'
import {  useRouter  } from 'vue-router';
    const router=useRouter()
    let columns=reactive([])
    const store= useIMStore()
   
    const getColumns= ()=>{
        if(store.flag==1){
            Object.assign(columns, store.columns);
        }else if(store.flag==2){ 
            Object.assign(columns, store.columns2);
        }
    }

    let data=reactive({
        records: [],
        total: 0,
        pageSize: 10,
        pageNum: 1
    })

    const pageSizeOpts=[1,3,5,10,20]
    const ifFlag=(flag)=>{

        if(flag==1){
            fetchData()
        }else{
            fetchData2()  
        }
        
    }
   
    onMounted(()=>{
        ifFlag(store.flag)
        
        getColumns()
    });


    const fetchData=async()=>{
        try{
            const res =await RecommendServer(data.pageNum,data.pageSize)
            Object.assign(data, res.data);
        }catch(e){
            console.log("获取数据失败：",data);
            
        }
    }

    const fetchData2=async()=>{
        try{
            const res =await useRongziyulanPage(data.pageNum,data.pageSize)
           
            Object.assign(data, res.data);
            // status：0：申请中 1：驳回 2：申请通过)
            console.log("获取数据成功：",data);
            
            
            //改变表格数据展示
           data.records.map(item=>{
            item.index=data.records.indexOf(item)+1
            // item.status=item.status==0?"申请中":item.status==1?"驳回":item.status==2?"申请通过":"未知"
            item.createTime=item.createTime.substring(0,10)
            item.updateTime=item.updateTime.substring(0,10)
            if(item.combinationName1!=null|item.combinationName2!=null){
                item.combinationName1=item.combinationName1+'、'+item.combinationName2
            }else{
                item.combinationName1='无'
                useRongziStore().setcombinationName(item.combinationName1)
            }
            item.action='详情'


           })
           

        }catch(e){
            console.log("获取数据失败：",data);
            
        }
    }


    const PageSizeChange=(pageSize)=>{
        data.pageSize=pageSize
        ifFlag(store.flag)

    }
    const PageNumChange=(pageNum)=>{
        data.pageNum=pageNum
        ifFlag(store.flag)
    }

    const pagePrev=(pageNum)=>{
       data.pageNum=pageNum
       ifFlag(store.flag)
    }
    const pageNext=(pageNum)=>{
       data.pageNum=pageNum
       ifFlag(store.flag)
    }

    const goToRongzixiangqing=(row, column,data)=>{
        if (data=='详情'){
            router.push({ path: '/home/rongzixiangqing/', query: { financeId: row.financeId }})
            
            console.log(row.financeId);
            
            
        }
    }
    const getStatus=(status)=>{
        let statusText=ref('')
        let tagType=ref('');
        switch (status) {
                    case 0:
                        statusText.value = '申请中';
                        tagType.value = 'warning'; // 使用警告类型
                        break;
                    case 1:
                        statusText.value = '驳回';
                        tagType.value = 'error'; // 使用危险类型
                        break;
                    case 2:
                        statusText.value = '申请通过';
                        tagType.value = 'success'; // 使用成功类型
                        break;
                    default:
                        statusText.value = '未知状态';
                        tagType.value = 'primary'; // 不设置类型
                }

        return {
            statusText,
            tagType
        };
    }
    
  
   

</script>

<template name="IMTable">
    <Table border  :columns="columns" :data="data.records"  @on-cell-click="goToRongzixiangqing"   stripe>
        <template #status="{ row }">
            <Tag :color="getStatus(row.status).tagType.value">
                {{getStatus(row.status).statusText.value}}
                
            </Tag>
        </template>
    </Table>
    <div class="page">
        <Page :total="data.total" show-sizer :page-size-opts="pageSizeOpts"
         @on-page-size-change="PageSizeChange"
         @on-change="PageNumChange"
         @on-prev="pagePrev"
         @on-next="pageNext"
        
         />
    </div>
</template>

<style lang="less" scoped>
.page{
    display: flex; /* 使用 Flexbox 布局 */
    justify-content: center; /* 水平居中 */
    margin-top: 20px;
}

</style>